<template>
  <div>
    <!--is-edit 控制删除按钮是否显示-->

    <van-contact-edit
        @save="save"
        @delete="deleteFn"
        :tel-validator="fn"
        :is-saving="false"
        :is-deleting="false"
        :is-edit="true"
        set-default-label="设为默认联系人sss"
        :show-set-default="true"
        :contact-info="info"></van-contact-edit>
  </div>
</template>

<script>
  import { ContactEdit  } from 'vant';
  export default {
    name: 'HelloWorld',
    data(){
      return {
        info:{
          id:9,
          name:`二丫`,
          tel:`180`,
          isDefault:false,
          xxx:"xx"
        }
      }
    },
    components:{
      [ContactEdit .name]:ContactEdit
    },
    methods:{
      //点击保存按钮时调用
      //当前函数返回true 代表检验通过
      //当前函数返回false 代表检验未通过
      fn(tel){
        console.log(tel);
        return true
      },

      //必须得等电话号码的检验通过才会触发
      save(info){
        console.log(info);
      },

      deleteFn(info){
        console.log(info);
      }
    }
  }
</script>

<style scoped>

</style>
